<template>
	<view class="files">
		<view class="fileinfo">
			<view class="submeida">
				<view class="medialine">
					<view class="mediaarea">
						<view class="mediaitem file" @click="btnclick('file')"></view>
					</view>
					<view class="mediatext">{{$t('baseCommon.buttons.selectFile')}}</view>
				</view>
				<view class="medialine">
					<view class="mediaarea">
						<view class="mediaitem photo" @click="btnclick('camera')"></view>
					</view>
					<view class="mediatext">{{$t('baseCommon.buttons.photosVideos')}}</view>
				</view>
				<view class="medialine">
					<view class="mediaarea">
						<view class="mediaitem audio" @click="btnclick('audio')"></view>
					</view>
					<view class="mediatext">{{$t('baseCommon.buttons.recording')}}</view>
				</view>
			</view>
			
			<view class="divide" v-if="files.length > 0"></view>
			
			<view v-if="files.length > 0">
				<file-list :files="files" :source="source" :hasdeleted="hasdeleted" :emitkey="emitkeyDel" @modifyName="fileModifyName"></file-list>
			</view>
		</view>
	</view>
</template>

<script>
	import FileList from "@/components/business/attach-file/file-list-offline.vue"
	import * as sqliteUtil from '@/utils/sqlite.js'
	import { file } from '@/utils/common.js'
	
	// #ifdef APP-PLUS
	// const camera = plus.camera.getCamera();
	// #endif
	
	export default {
		props: {
			files: {
				type: Array,
				default() {
					return []
				}
			},
			hasdeleted: {
				type: Boolean,
				default: false
			},
			emitkey: {
				type: String,
				default: ''
			},
			source: {
				type: Object,
				default: null
			}
		},
		components: {
			FileList
		},
		data() {
			return {
				emitkeyAdd: this.emitkey + '_add',
				emitkeyDel: this.emitkey + '_del'
			}
		},
		methods: {
			btnclick(type) {
				const _this = this
				if(type == "file") {
					uni.chooseImage({
					    sizeType: ['original'],
					    sourceType: ['album'],
					    success: function (res) {
							let images = res.tempFilePaths
							for(var i in images) {
								file.compressImage(images[i], 50, imgUrl => {
									_this.uploadFile(imgUrl)
								})
							}
					    }
					});
				} else if(type == "camera") {
					// #ifdef APP-PLUS
					const camera = plus.camera.getCamera();
					// #endif
					uni.showActionSheet({
					    itemList: [_this.$t('baseCommon.buttons.photo'), _this.$t('baseCommon.buttons.video')],
					    success: function (res) {
							if(res.tapIndex === 0){ //拍照
								var resolution = camera.supportedImageResolutions[0];
								var format = camera.supportedImageFormats[0];
								camera.captureImage(function(path){
									file.compressImage(path, 50, imgUrl => {
										_this.uploadFile(imgUrl)
									})
								},function(error) {
									console.log("Capture image failed: " + error.message);
								},{resolution:resolution, format:format});
							} else { //录像
								var resolution = camera.supportedVideoResolutions[0];
								var format = camera.supportedVideoFormats[0];
								camera.startVideoCapture(function(path){
									file.compressVideo(path, url => {
										_this.uploadFile(url)
									})
								},function(error) {
									console.log("Capture video failed: " + error.message);
								},{resolution:resolution, format:format});
							}
					    },
					    fail: function (res) {
					        console.log(res.errMsg);
					    }
					});
				} else if(type == "audio") {
					uni.navigateTo({
						url: "/pages/base/voice-offline?emitkey="+ _this.emitkeyAdd + "&source="+JSON.stringify(this.source)
					})
				}
			},
			async uploadFile(item) {
				let ext = item.substring(item.lastIndexOf(".")+1)
				let fileName = new Date().getTime()
				let addFile = {
					name: fileName,
					filePath: '',
					ext: ext,
					uploadState: '0'
				}
				
				uni.saveFile({
					tempFilePath: item,
					success: function (res) {
						addFile.filePath = res.savedFilePath
						sqliteUtil.insertMCpisFileAttachment(addFile).then(result=>{
							addFile.id = result
						})
					}
				});
				
				setTimeout(()=>{
					if(this.source) {
						let data = {
							source: this.source,
							addFile: addFile
						}
						uni.$emit(this.emitkeyAdd, data)
					} else {
						uni.$emit(this.emitkeyAdd, addFile)
					}
				}, 500)
				
			},
			fileModifyName(data) {
				if(this.source) {
					this.$emit("modifyName", data, this.source)
				} else {
					this.$emit("modifyName", data)
				}
			}
		}
	}
</script>

<style>
	.files {
		padding: 8px 0;
	}
	
	.fileinfo {
		background-color: #FFFFFF;
		/* padding: 0 20rpx; */
	}
	
	.submeida{
		width: 100%;
		display: flex;
		padding: 10px 0;
	}
	
	.medialine{
		flex: 1;
		text-align: center;
	}
	
	.mediaarea {
		width: 40px;
		height: 40px;
		border-radius: 50%;
		background-color: #EFEFEF;
		margin: 0 auto;
		padding: 10px;
	}
	
	.mediaitem {
		width: 30px;
		height: 30px;
		padding: 5px;
	}
	
	.mediatext {
		font-size: 14px;
		color: #333333;
		padding-top: 8px;
	}
	
	.file{
		background: url(../../../static/images/icon/folder.png) no-repeat center center;
		background-size: 100% 100%;
	}
	
	.photo{
		background:url(../../../static/images/icon/camera.png);
		background-size: 100% 100%;
	}
	
	.audio{
		background:url(../../../static/images/icon/microphone.png);
		background-size: 100% 100%;
	}
	
	.divide{
		border-top: solid 1px #EFEFEF;
	}
</style>
